// 初始化样式
html,
body,
#app {
	width: 100% !important;
	height: 100%;
	padding: 0;
	margin: 0;
	overflow: overlay;
	font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', SimSun, sans-serif;
	font-size: 16px;
	-webkit-font-smoothing: antialiased;
	-webkit-tap-highlight-color: transparent;
}

// 全局样式
.global-relative {
	position: relative;
}
.global-hidden {
	overflow: hidden;
}
input {
	color: var(--app-container-text);
	background-color: var(--app-container-bg);
}

// 滚动条的宽度
::-webkit-scrollbar {
	width: 6px;
	height: 0;
}
// 滚动条的设置
::-webkit-scrollbar-thumb {
	background-color: #dddddd;
	border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
	background-color: #bbbbbb;
}
::-webkit-scrollbar-corner {
	background: rgb(0 0 0 / 0%);
}

// 列表动画
.msg-enter-from,
.msg-leave-to {
	opacity: 0;
	transform: translateY(30px);
}
.msg-enter-active,
.msg-leave-active {
	transition: all 0.5s ease;
}
.msg-leave-active {
	position: absolute;

	/* 加个定位，就可以解决 删除元素的时候 其他同级元素不做动画 */
}
.msg-move {
	/* 加上这个类 以后，可以让 元素添加的时候，其他同级的元素也作动画 ，但是删除元素的时候，其他元素做动画 会有 bug */
	transition: transform 0.5s ease;
}
